<template>
	<view class="offical">
		<view class="title">
			<text style="font-size: 18px;">
				平台简介
			</text>
		</view>
		<view class="content" style="background-color: #fff; width: 90%; margin: 0 5%; border-radius: 10px;">
			<view class="Company_Profile" style="padding: 0 15px; 10px 0">
				<div style="display: flex; justify-content: space-between; align-items: center; height: 60px;border-bottom: 1px solid #888;">
					<text style="margin-top: 10px;">公司简介</text> 
					<div class="clearinghouse" style="width: 150px; margin-top: 10px;">
						<u-button color="red" customStyle="color:#ffff00" shape="circle" text="公司艺术品交流中心"
							size="small" ></u-button>
					</div>
						
				</div>
				<div style="width: 100%;height: 100%;margin-top: 10px;" v-html="zytStore.platformBrief">
				</div>
			</view>
		</view>
		<view class="process" style="width: 90%; margin: 15px 5% 0 5%; background-color: #fff; height: 280px; border-radius: 10px;padding: 0 15px; 10px 0">
			<text style="margin-top: 10px; height: 60px; line-height: 60px;">平台流程</text> 
			<video
			      src="http://192.168.1.2:8360/static/upload/zyt/db6a9336-0268-41df-99f0-43417d60e93d.mp4"
			      controls
			      autoplay
			      loop
			      muted
			      @play="onPlay"
			      @pause="onPause"
				  style="width: 100%;height: 200px; margin: auto;"
			    ></video>
		</view>
		<view class="content" style="background-color: #fff; width: 90%; margin: 15px 5% 0 5%; border-radius: 10px;">
			<view class="Company_Profile" style="padding: 0 15px; 10px 0">
				<div style="display: flex; justify-content: space-between; align-items: center; height: 60px;border-bottom: 1px solid #888;">
					<text style="margin-top: 10px;">平台规则(与)招商方案</text> 
					<div class="clearinghouse" style="width: 150px; margin-top: 10px;">
					</div>
						
				</div>
				<div style="width: 100%;height: 100%;margin-top: 10px;" v-html="zytStore.platformRule">
				</div>
			</view>
		</view>
		<view class="content" style="background-color: #fff; width: 90%; margin: 15px 5% 30px 5%; border-radius: 10px;">
			<view class="Company_Profile" style="padding: 0 15px; 10px 0">
				<div style="display: flex; justify-content: space-between; align-items: center; height: 60px;border-bottom: 1px solid #888;">
					<text style="margin-top: 10px;">平台投资与分红方案</text> 
					<div class="clearinghouse" style="width: 150px; margin-top: 10px;">
					</div>
						
				</div>
				<div style="width: 100%;height: 100%;margin-top: 10px;">
					<img src="http://192.168.1.2:8360/static/upload/zyt/91e21ba0-36bc-4135-8d2a-859a7f1cfeae.jpg" alt="">
					<img src="http://192.168.1.2:8360/static/upload/zyt/4512e4ca-923e-4369-a367-97ca5d2c2753.jpg" alt="">
					<img src="http://192.168.1.2:8360/static/upload/zyt/b43ad99c-6e1b-4969-8748-69ba55a3f62d.jpg" alt="">
				</div>
			</view>
		</view>
	</view>
</template>

<script>
	import {}from '@/config/api.js'
	export default {
		data() {
			return {
				zytStore: null,
			}
		},
		methods: {
			onPlay(){
				console.log("视频已播放")
			},
			onPause(){
				console.log("视频已暂停")
			}
		},
		mounted() {
			
		},
		onLoad(option){
			console.log(option.zytStore)
		}
	}
</script>

<style lang="scss" scoped>
@import 'offical.scss';
@keyframes pulse {
    0%, 100% {
        transform: scale(1); /* 初始和结束状态，放大1.2倍 */
    }
    50% {
        transform: scale(1.2); /* 中间状态，放大1.4倍 */
    }
}
.clearinghouse{
	/* 初始缩放为1（100%大小） */
	animation: pulse 2s ease-in-out infinite;
	/* 应用动画，持续时间为5秒，无限循环 */
}
rich-text img {
  max-width: 100%;  /* 图片最大宽度为100% */
  height: auto;     /* 保持宽高比 */
}
</style>
